﻿/// <reference path="../../js/utils.js" />
'use strict';

define([
    'backbone',
    'screenView',

    'common/models/truck.model',

    'backgrid.all',
],
function (Backbone, ScreenView, TruckModel, Backgrid) {
    var View = ScreenView.extend({
        super: null,

        name: 'maintenance',
        title: 'Mantenimiento',

        initialize: function () {
            this.super = View.__super__;

            return this.super.initialize.apply(this, arguments);
        },

        render: function () {
            this.super.render.apply(this);

            /* First render actions. */
            if (!this.rendered) {
                
                var MaintenanceModel = Backbone.Model.extend({
                    defaults: {
                        name: 'Eje Delantero',
                        lastReliningDate: '2015-05-02',
                        lifeTime: 1234,
                        maxLifeTime: 9999,
                        notify: true,
                    },
                });
                var MaintenanceCollection = Backbone.Collection.extend({
                    defaults: {
                        model: MaintenanceModel,
                    },
                });

                var maintenanceCol = new MaintenanceCollection();

                this.maintenanceTruckGrid = new Backgrid.Grid({
                    columns: [
                        {
                            name: 'name',
                            label: 'Equipo',
                            cell: 'string-center',
                        },
                        {
                            name: 'lifeTime',
                            label: 'Uso Actual (Km)',
                            cell: 'integer',
                        },
                        {
                            name: 'maxLifeTime',
                            label: 'Uso Máximo (Km)',
                            cell: 'integer',
                        },
                        {
                            name: 'lastReliningDate',
                            label: 'Cambio Anterior',
                            cell: Backgrid.Extension.MomentCenterCell.extend({
                                modelFormat: "YYYY-MM-DD",
                                displayFormat: "MMM-DD HH:mm"
                            }),
                        },
                        {
                            name: 'relining',
                            label: '',
                            cell: Backgrid.Extension.ButtonCell.extend({
                                buttonLabel: 'Cambiar',
                                events: {
                                    //click: function () { alert(1); }
                                },
                            }),
                        },
                        {
                            name: 'notify',
                            label: 'Notificar',
                            cell: 'boolean',
                        },
                    ],
                    collection: maintenanceCol,
                    row: Backgrid.Extension.ConditionalStyleRow.extend({
                        evaluate: function () {
                            if (this.model.get('lifeTime') > this.model.get('maxLifeTime'))
                                return 'maintenance-max-exceeded-row';
                        },
                    }),
                });
                this.maintenanceTruckGrid.render();
                // Render the grid and attach the Grid's root to your HTML document
                this.$el.find('#maintenanceTruckGrid').append(this.maintenanceTruckGrid.el);

                this.maintenanceSemiGrid = new Backgrid.Grid({
                    columns: [
                        {
                            name: 'name',
                            label: 'Equipo',
                            cell: 'string-center',
                        },
                        {
                            name: 'lifeTime',
                            label: 'Uso Actual (Km)',
                            cell: 'integer',
                        },
                        {
                            name: 'maxLifeTime',
                            label: 'Uso Máximo (Km)',
                            cell: 'integer',
                        },
                        {
                            name: 'lastReliningDate',
                            label: 'Cambio Anterior',
                            cell: Backgrid.Extension.MomentCenterCell.extend({
                                modelFormat: "YYYY-MM-DD",
                                displayFormat: "MMM-DD HH:mm"
                            }),
                        },
                        {
                            name: 'relining',
                            label: '',
                            cell: Backgrid.Extension.ButtonCell.extend({
                                buttonLabel: 'Cambiar',
                                events: {
                                    click: function () { alert(1); }
                                },
                            }),
                        },
                        {
                            name: 'notify',
                            label: 'Notificar',
                            cell: 'boolean',
                        },
                    ],
                    collection: maintenanceCol,
                    row: Backgrid.Extension.ConditionalStyleRow.extend({
                        evaluate: function () {
                            if (this.model.get('lifeTime') > this.model.get('maxLifeTime'))
                                return 'maintenance-max-exceeded-row';
                        },
                    }),
                });
                this.maintenanceSemiGrid.render();
                // Render the grid and attach the Grid's root to your HTML document
                this.$el.find('#maintenanceSemiGrid').append(this.maintenanceSemiGrid.el);

                maintenanceCol.set([
                    new MaintenanceModel({ name: 'Eje trasero' }),
                    new MaintenanceModel({ name: 'Aceite', }),
                    new MaintenanceModel({ name: 'Aceite', maxLifeTime: 1000, }),
                    new MaintenanceModel({ name: 'Eje Delantero', }),
                    new MaintenanceModel({ name: 'Aceite', }),
                    new MaintenanceModel({ name: 'Motor', maxLifeTime: 500 }),
                ]);




                /* Indicates that the view was rendered at least one time. */
                this.rendered = true;
            }
            /* Not first render actions. */
            else {
                
            }


            return this;
        },
    });

    return View;
});